﻿<template>
  <el-checkbox-group v-loading="isLoading" v-model="data"
                     :disabled="disabled">
    <el-checkbox v-for="item in dataList" :disabled="disabled" :key="item.id" :label="item.id">{{item.name}}</el-checkbox>
  </el-checkbox-group>
</template>
<script>
function noop() {}
export default {
  name: "MetaCheckboxGroup",
  props: {
    value:{},
    //枚举id
    type: {},
    placeholder:{},
    //是否禁用
    disabled:{
      type:Boolean,
      default:false
    },
    //是否可多选
    multiple:{
      type:Boolean,
      default:false,
    },
    //是否只读
    readonly:{
      type:Boolean,
      default:false,
    }
  },
  model: {
    prop: 'value',
    event: 'change'
  },
    data(){
      return {
          dataList:[],
          isLoading:true,
      }
    },
  computed:{
    data:{
      get(){
        return this.value;
      },
      set(value){
        this.$emit("change",value);
      }
    }
  },
  watch:{
    value:{
      handler(value) {
        // this.$emit("change",value);
      }
    }
  },
  mounted(){
    this.loadDataList();
  },
  methods: {
    updateValue(val){
      // this.$emit('input', val)
      // this.$emit('change', val)
    },
    loadDataList: function () {
      this.isLoading = true;

      let url = "/meta/type/"+this.type;
      this.addAjaxCachePath(url)
      this.$get(url, {}, (response) => {
        this.dataList = response.data;
        this.$emit("load",response.data,this);
      },()=>{
        this.isLoading = false;
      })
    },
    getNameMap() {
      let map = {};
      for(let item of this.dataList) {
        map[item.id] = item.name;
      }
      return map;
    },
    getDataMap() {
      let map = {};
      for(let item of this.dataList) {
        map[item.id] = item;
      }
      return map;
    }
  }
};
</script>
